<template>
  <div class="addDialog">
    <el-dialog
      title="新增工资项"
      width="40%"
      :visible="addDialog"
      :before-close="close"
    >
      <el-radio v-model="radio" label="1" border>月工资项</el-radio>
      <el-radio v-model="radio" label="2" border>其他工资项</el-radio>
      <el-form
        style="margin-top: 10px"
        :model="form"
        label-position="top"
        size="mini"
      >
        <el-form-item label="工资项名称" :label-width="formLabelWidth">
          <el-input
            v-model="form.name"
            autocomplete="off"
            placeholder="1-50个字符"
          ></el-input>
        </el-form-item>
        <el-form-item  label="工资标准">
          <span>计算方式</span>
          <br />
          <el-select v-model="value1">
            <el-option label="按公式计算" value="按公式计算"></el-option>
            <el-option label="固定金额" value="固定金额"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div v-if="value1 == '按公式计算'">
        <el-form
          size="mini"
          label-position="top"
          :inline="true"
          :model="form"
          class="demo-form-inline"
        >
          <el-form-item label="选择公式">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            <el-select v-model="value2">
              <el-option label="5" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="结果设置">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="保留小数位数后">
            <el-select v-model="value2">
              <el-option label="5" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            位
          </el-form-item>
         <div v-if="radio=='2'">
            <el-form-item label="核算日期">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            <el-date-picker
              v-model="value2"
              align="right"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
           <el-form-item label="发放日期">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            <el-date-picker
              v-model="value2"
              align="right"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
         </div>
        </el-form>
      </div>
      <div v-if="value1 == '固定金额'">
         <el-form
        size="mini"
        label-position="top"
        :inline="true"
        :model="form"
        class="demo-form-inline"
      >
        <el-form-item label="金额（元）">
          <el-input v-model="value2"></el-input>
        </el-form-item>
         <div v-if="radio=='2'">
            <el-form-item label="核算日期">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            <el-date-picker
              v-model="value2"
              align="right"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
           <el-form-item label="发放日期">
            <el-select v-model="value2">
              <el-option label="四舍五入" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            <el-date-picker
              v-model="value2"
              align="right"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
         </div>
      </el-form>
      </div>
     
      <div slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "addPayroll",
  components: {},
  props: {
    addDialog: { type: Boolean },
  },
  dicts: ["contract_type"],
  data() {
    return {
      radio: "1",
      value1: "按公式计算",
      value2: "",
      dynamicTags: ["标签一", "标签二", "标签三"],
      inputVisible: false,
      inputValue: "",

      form: {
        name: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
      },
      formLabelWidth: "120px",
    };
  },
  methods: {
    submit() {
      this.close();
    },
    close() {
      this.$emit("close", false);
    },
  },
  mounted() {
    console.log("aaaaaaaaa");
  },
};
</script>

<style lang="less" scoped>
.el-tag + .el-tag {
  margin-left: 10px;
}
.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}
.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}
.el-select {
  margin-right: 10px;
}
</style>

